<template>
  <view>
    <dev-navbar mode="center" title="健康豆明细"></dev-navbar>
    <view class="detailed-list-of-growth-value" v-for="(item,index) in listData" :key="item.id">
      <view class="">
        <view class="task-name">
          <!-- 完善健康档案 -->
          {{item.reason}}
        </view>
        <view class="task-time">
          {{item.time}}
        </view>
      </view>
      <view class="task-reward">
        {{item.type==1?'+':'－'}}{{item.growth_value}}
      </view>
    </view>



    <!-- 加载部分 -->
    <view class="">
      <view class="loading-lou" v-show="loadings && pageCurrent>1">
        <view class="loading-san-lou">
          <!-- <u-loading size="40" :show="loadings"></u-loading> -->
          <view class="logintext-lou">一大波数据正在赶来~~</view>
        </view>
      </view>
      <view class="nodata-more-lou" v-show="nodata && !empty">
        没有更多数据
      </view>
      <view class="loading-box" v-show="loadings&&pageCurrent==1">
        <!-- <u-loading :show="loadings" color="#2EA7E0" size="70"></u-loading> -->
        <view class="loading-textsl">
          加载中
        </view>
      </view>
      <!-- 暂无数据 -->
      <view class="nodata-box-lou" v-show="empty">
        <!-- <image style="width: 500rpx;height: 500rpx;" src="/static/blueLagoon/kong.png" mode=""></image> -->
        <view class="loading-textsl">
          暂无数据
        </view>
      </view>
    </view>


  </view>
</template>

<script>
  export default {
    data() {
      return {
        pageCurrent: 1, //页码
        pageSize: 20, //条数
        listData: [],
        is_pull: false,
        loadings: false,
        last_page: '', //总页数
        loadingone: false,
        nodata: false, //没有更多数据
        empty: false, //是否一条数据都没有
      };
    },
    onShow() {
      this.obtainWithdrawalRecord(); //获取提现记录
    },
    methods: {
      obtainWithdrawalRecord(e) {
        this.nodata = false;
        this.empty = false;
        this.loadings = true;
        if (e) {
          this.pageCurrent = e;
        }
        if (this.pageCurrent == 1) {
          this.listData = [];
        }
        this.$https.get(global.apiUrls.consumRecordList, {
          pageCurrent: this.pageCurrent, //页码
          pageSize: this.pageSize, //每页条数
        }).then(res => {
          if (!res.data.result.records.length && this.pageCurrent == 1) {
            this.empty = true;
          }
          if (res.data.result.records == null) {
            res.data.result.records = [];
          }
          this.listData = [...this.listData, ...res.data.result.records];
          this.is_pull = false;
          this.loadings = false;
          if (res.data.result.pages == null) {
            res.data.result.pages = 0;
          }
          this.last_page = res.data.result.pages;
          if (this.pageCurrent > this.last_page || res.data.result.pages == 1) {
            this.nodata = true;
          }

        }).catch(err => {
          this.loadings = false;
          this.nodata = true;
        })
      },

    }

  }
</script>

<style lang="scss" scoped>
  .list-box {
    margin-bottom: 10rpx;
    padding-bottom: 10rpx;
    background-color: #FFFFFF;
  }

  .detailed-list-of-growth-value {
    height: 126rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1rpx solid #F5F5F5;
    padding: 0rpx 20rpx;
    background-color: #FFFFFF;

    .task-name {
      max-width: 520rpx;
      height: 42rpx;
      font-size: 30rpx;
      font-weight: 400;
      color: #333333;
      line-height: 42rpx;
    }

    .task-reward {
      height: 42rpx;
      font-size: 30rpx;
      font-weight: 500;
      color: #333333;
      line-height: 42rpx;
    }

    .task-time {
      height: 33rpx;
      font-size: 24rpx;
      font-weight: 400;
      color: #9B9B9B;
      line-height: 33rpx;
    }

  }
</style>
